<template>
	<div id="shopingDetail">
		<div class="shoping-header">
			<img src="../images/ic_shopdetail_back.png" @click="back()" class="fl">
			<div class="shoping-header-list fl">
				<div class="shoping-header-item">
					<router-link to="#">
						商品
					</router-link>
				</div>
				<div class="shoping-header-item">
					<router-link :to="'/shop/shopingComment/id/'+mall_goods.commodity_id">
						评论
					</router-link>
				</div>
				<div class="shoping-header-item">
					<router-link to="">
						详情
					</router-link>
				</div>
			</div>

			<div class="shoping-header-more fr">
				<img src="../images/ic_shopdetail_more.png" alt="">
			</div>
			<div class="shoping-header-share fr">
				<img src="../images/ic_shopdetail_share.png" alt="">
			</div>
			<div class="clear"></div>
		</div>
		<div class="detialBanner">
			<swiper loop :show-desc-mask="false" auto dots-position="center" :aspect-ratio="662/750">
				<swiper-item v-for="(item,index) in banner_list"  :key="index" >
					<!-- <a :href="item.url"> -->
					<img :src="item" class="vux-img" />
					<!-- </a> -->
				</swiper-item>
			</swiper>
			<div class="back-list">
				<div class="back fl" @click="back()"><img src="../images/ic_shopdetail_back.png" alt=""></div>
				<div class="back-box fr">
					<div class="back-item share fl">
						<img src="../images/ic_shopdetail_share.png" alt="">
					</div>
					<div class="back-item fl">
						<img src="../images/ic_shopdetail_more.png" alt="">
					</div>
					<div class="clear"></div>
				</div>
				<div class="clear"></div>
			</div>
			<div class="shop-text">
				<img src="../images/shop.png" class="fl" alt="">
				<p class="fl">梨花**雨 购买成功</p>
			</div>
		</div>
		<div class="detial-titleBox">
			<div class="detial-moneyBox">
				<div class="detial-money">
					<p class="fl" v-if="mall_goods.goods_price<goods.goods_price">￥{{goods.goods_price}}<span class='fl' style="float: right;margin-left: 0.26rem;">￥{{mall_goods.goods_price}}</span></p>
					<p class="fl" v-else>￥{{mall_goods.goods_price}}</p>
					<div class="detial-shopid fr" v-if="mall_goods.sell_num">已售出{{mall_goods.sell_num}}</div>
					<div class="detial-shopid fr" v-else>已售出0</div>
					<div class="clear"></div>
				</div>

			</div>
			<div class="detial-titleCont">
				<div class="detial-boxLeft fl">
					<div class="detial-title">
						<span class="detial-title-class fl">自营</span><span class='fl' v-html="goods.goods_name"></span>
						<div class="clear"></div>
					</div>
					<div class="detial-titleContC">{{mall_goods.goods_jingle}}</div>
				</div>
				<div class="detial-boxRight fl">
					<p v-if="mall_goods.eval_goods_rate">{{parseFloat(mall_goods.eval_goods_rate).toFixed(1)}}%</p>
					<p v-else>0</p>
					<span>好评率</span>
				</div>
				<div class="clear"></div>
			</div>
		</div>
		<div class="parameter-list">
			<div class="parameter-item" @click="couponshow(this);">
				<div class="parameter-title fl">
					优惠
				</div>
				<div class="discount-list fl">
					<div class="discount-item">
						满399减50
					</div>
					<div class="discount-item">
						满399减50
					</div>
				</div>
				<img class="discount-more fr" src="../images/icon_shopdetail_seemore.png" alt="">
				<div class="clear"></div>
			</div>
			<div class="parameter-item" @click='shopingshow()'>
				<div class="parameter-title fl">
					已选
				</div>
				<div class="discount-list fl">
					<img class="active-img fl" src="../images/pro.png" alt="">
					<div class="active-cont fl">“如意平安”，“新籽9mm*7mm优质级”</div>
					<div class="clear"></div>
				</div>
				<img class="discount-more fr" src="../images/icon_shopdetail_seemore.png" alt="">
				<div class="clear"></div>
			</div>
			<div class="parameter-item" @click='addressshow(this)'>
				<div class="parameter-title fl">
					配送
				</div>
				<div class="discount-list fl">
					<div class="address">至 {{defaultAdd.receiver_province}}>{{defaultAdd.receiver_city}}>{{defaultAdd.receiver_county}}</div>
					<div class="discount-num">
						<span>库存{{mall_goods.goods_num}}件</span>
						<p>免运费</p>
					</div>
				</div>
				<img class="discount-more fr" src="../images/icon_shopdetail_seemore.png" alt="">
				<div class="clear"></div>
			</div>
			<div class="parameter-item">
				<div class="parameter-title fl">
					参数
				</div>
				<div class="discount-list fl">
					<div class="cs">产地、颜色、作者...</div>
				</div>
				<img class="discount-more fr" src="../images/icon_shopdetail_seemore.png" alt="">
				<div class="clear"></div>
			</div>
		</div>
		<div class="fafafa">
			<div class="img-list fl">
				<div class="img-item">
					<img src="../images/ic_shopdetail_safe.png" alt="" class="fl">
					<div class="fl">消费者保障</div>
					<div class="clear"></div>
				</div>
				<div class="img-item">
					<img src="../images/ic_shopdetail_safe.png" alt="" class="fl">
					<div class="fl">包邮</div>
					<div class="clear"></div>
				</div>
				<div class="img-item">
					<img src="../images/ic_shopdetail_safe.png" alt="" class="fl">
					<div class="fl">7天包退</div>
					<div class="clear"></div>
				</div>
			</div>
			<img class="discount-more fr" src="../images/icon_shopdetail_seemore.png" alt="">
			<div class="clear"></div>
		</div>
		<!-- 评论 -->
		<div class="comment" id="comment">
			<div class="comment-title-box">
				<p class="comment-title fl">评论</p>
				<div class="comment-good fl">
					{{parseFloat(mall_goods.eval_goods_rate).toFixed(1)}}%好评<span>(135)</span>
				</div>
				<div class="fr commeng-write">
					<img src="../images/icon_shopdetail_comment.png" class="fl" alt="">
					<router-link :to="'/shop/shopingComment/id/'+id">
						<div class="fl">写评论</div>
					</router-link>
					<div class="clear"></div>
				</div>
				<div class="clear"></div>
			</div>
			<div class="comment-list">
				<div class="comment-item">
					简约美丽 525
				</div>
				<div class="comment-item">
					发货很快 235
				</div>
				<div class="comment-item">
					发货很快 235
				</div>
			</div>
			<div class="commentCont-list">
				<div class="commentCont-item">
					<div class="commentCont-left fl">
						<div class="commentCont-user">
							<img src="../images/pro.png" height="418" width="345" class="commentCont-userImg fl" alt="">
							<span class="commentCont-username fl">子***木</span>
							<img src="../images/ic_shopdetail_buyer_v2.png" class="commentCont-userState fl" alt="">
							<div class="clear"></div>
						</div>
						<ul class="comment-num">
							<li class="comment-num-item fl active"></li>
							<li class="comment-num-item fl"></li>
							<li class="comment-num-item fl"></li>
							<li class="comment-num-item fl"></li>
							<li class="comment-num-item fl"></li>
							<span class='fl'>9.2分</span>
							<li class="clear"></li>
						</ul>
						<div class="comment-cont">
							迷你小瓶,喝起来真的很不错很起来真的很不错迷你小瓶的你小瓶,喝起不错
						</div>
					</div>
					<div class="commentCont-right fr">
						<img src="../images/pro.png" alt="">
						<div class="commentCont-right-bc">4张</div>
					</div>
					<div class="clear"></div>
				</div>
				<div class="commentCont-item">
					<div class="commentCont-left fl">
						<div class="commentCont-user">
							<img src="../images/pro.png" height="418" width="345" class="commentCont-userImg fl" alt="">
							<span class="commentCont-username fl">子***木</span>
							<img src="../images/ic_shopdetail_buyer_v2.png" class="commentCont-userState fl" alt="">
							<div class="clear"></div>
						</div>
						<ul class="comment-num">
							<li class="comment-num-item fl active"></li>
							<li class="comment-num-item fl"></li>
							<li class="comment-num-item fl"></li>
							<li class="comment-num-item fl"></li>
							<li class="comment-num-item fl"></li>
							<span class='fl'>9.2分</span>
							<li class="clear"></li>
						</ul>
						<div class="comment-cont">
							迷你小瓶,喝起来真的很不错很起来真的很不错迷你小瓶的你小瓶,喝起不错
						</div>
					</div>
					<div class="commentCont-right fr">
						<img src="../images/pro.png" alt="">
						<div class="commentCont-right-bc">4张</div>
					</div>
					<div class="clear"></div>
				</div>
				<div class="clear"></div>
			</div>
			<!-- //答案 -->
			<div class="answer">
				<router-link :to="'/Question/id/'+mall_goods.commodity_id">
					<div class="answer-title">
						<p class="fl">回答<span>62</span></p>
						<a href="" class="fr answer-more"><img src="../images/arrow.png" alt=""></a>
						<div class="clear"></div>
					</div>
				</router-link>
				<div class="answer-item">
					<img src="../images/icon_shopdetail_ask.png" class="fl" alt="">
					<p class="fl answer-cont">请问这是真品吗？会不会是高仿品欺啊啊啊</p>
					<p class="fr answer-num">7个回答</p>
					<div class="clear"></div>
				</div>
				<div class="answer-item">
					<img src="../images/icon_shopdetail_ask.png" class="fl" alt="">
					<p class="fl answer-cont">请问这是真品吗？会不会是高仿品欺</p>
					<p class="fr answer-num">7个回答</p>
					<div class="clear"></div>
				</div>
			</div>
		</div>
		<!-- 商家 -->
		<div class="shop">
			<div class="shop-title-box">
				<img :src="shopInfo.shop_logo" class="shop-img">
				<div class="shop-release fl">
					<div class="shop-title fl">
						<p class="fl">{{shopInfo.shop_name}}</p><img src="../images/ic_shopdetail_buyer_v2.png" class="fl" alt="">
						<div class="clear"></div>
					</div>
					<div class="shop-release-list">
						<div class="shop-release-item fl">
							<img src="../images/ic_shopdetail_seller_authentication.png" class="fl" alt="">
							<p class="fl">新开店铺</p>
						</div>
					</div>

				</div>
				<div class="goshop fr">
					<a href="">
						进店逛逛
					</a>
				</div>
				<div class="clear"></div>
			</div>
			<div class="shop-num">
				<div class="shop-num-item fl">
					<p>1542</p>
					<span>关注人数</span>
				</div>
				<div class="shop-num-item fl">
					<p>1542</p>
					<span>关注人数</span>
				</div>
				<div class="shop-num-item2 fr">
					<div class="shop-num-box">
						描述相符 <b>4.84</b> <span>高</span>
					</div>
					<div class="shop-num-box">
						服务态度 <b>4.84</b> <span>高</span>
					</div>
					<div class="shop-num-box">
						发货速度 <b>4.84</b> <span>高</span>
					</div>
				</div>
				<div class="clear"></div>
			</div>
		</div>
		<!-- 相似商品 -->
		<div class="similar">
			<div class="answer-title">
				<p class="fl">相似商品</p>
				<a href="" class="fr answer-more"><img src="../images/arrow.png" alt=""></a>
				<div class="clear"></div>
			</div>
			<div class="similar-list">
				<div class="similar-item fl">
					<img src="../images/pro.png" alt="">
					<div class="similar-item-title">碧绿叶海瓷碟</div>
					<div class="similar-item-nowmoney">
						79<span>元</span>
					</div>
					<div class="similar-item-money">
						126元
					</div>
					<div class="similar-item-goshop">
						<a href=""><img src="../images/icon_shopdetail_news_shopping_trolley2.png" alt=""></a>
					</div>
				</div>
				<div class="similar-item fl">
					<img src="../images/pro.png" alt="">
					<div class="similar-item-title">碧绿叶海瓷碟</div>
					<div class="similar-item-nowmoney">
						79<span>元</span>
					</div>
					<div class="similar-item-money">
						126元
					</div>
					<div class="similar-item-goshop">
						<a href=""><img src="../images/icon_shopdetail_news_shopping_trolley2.png" alt=""></a>
					</div>
				</div>
				<div class="similar-item fl">
					<img src="../images/pro.png" alt="">
					<div class="similar-item-title">碧绿叶海瓷碟</div>
					<div class="similar-item-nowmoney">
						79<span>元</span>
					</div>
					<div class="similar-item-money">
						126元
					</div>
					<div class="similar-item-goshop">
						<a href=""><img src="../images/icon_shopdetail_news_shopping_trolley2.png" alt=""></a>
					</div>
				</div>
				<div class="clear"></div>
			</div>
		</div>
		<!-- 详情 -->
		<div class="detialCont" id="#detialCont">
			<div class="detialCont-title">
				<p>图文详情</p>
			</div>
			<div class="detialCont-box">

			</div>
		</div>
		<div class="footer">
			<div class="footer-state fl">
				<div class="shopname footer-state-item">
					<a href="">
						<img src="../images/icon_shopdetail_store.png" alt="">
						<p>店铺</p>
					</a>
				</div>
				<div class="shoucang footer-state-item">
					<a href="">
						<img src="../images/icon_shopdetail_collection.png" alt="">
						<p>收藏</p>
					</a>
				</div>
				<div class="shoping footer-state-item">
					<router-link to="/ShopCart">
						<img src="../images/shoping.png" alt="">
						<p>购物车</p>
						<div class="shoping-bc" v-show="cart_num">{{goods_cart_total}}</div>
					</router-link>
				</div>
			</div>
			<div class="fl join-shop" @click='shopingshow(this)'>
				加入购物车
			</div>
			<div class="fl go-shop">
				立即购买
			</div>
			<div class="clear"></div>
		</div>
		<!-- //弹窗遮罩层 -->
		<div class="showBc" @click="remove(this);"></div>
		<!-- //领取优惠票 -->
		<div class="coupon">
			<div class="coupon-title">
				优惠券
			</div>
			<div class="coupon-close" @click="remove(this);">
				X
			</div>
			<div class="coupon-titleBox">
				<p class="fl">可领取优惠券</p>
				<span class='fr'>查看我的优惠券</span>
				<div class="clear"></div>
			</div>
			<div class="copon-list">
				<div class="copon-item">
					<img src="../images/coupon.png" alt="">
					<div class="copon-item-title">店铺优惠券</div>
					<div class="copon-item-contBox">
						<div class="copon-item-money">
							￥<span>200</span>
						</div>
						<div class="copon-item-cont">
							<p>订单满3000元使用</p>
							<p>2017.11.14~2018.12.12</p>
						</div>
					</div>
					<div class="copon-item-go">
						立即领取
					</div>
				</div>
				<div class="copon-item">
					<img src="../images/coupon2.png" alt="">
					<div class="copon-item-title">店铺优惠券</div>
					<div class="copon-item-contBox">
						<div class="copon-item-money">
							￥<span>600</span>
						</div>
						<div class="copon-item-cont">
							<p>订单满3000元使用</p>
							<p>2017.11.14~2018.12.12</p>
						</div>
					</div>
					<div class="copon-item-go2">
						领取成功
					</div>
				</div>
			</div>
			<div class="copon-text"><span>店铺优惠券只能在指定店铺使用，不可跨店使用</span></div>
		</div>
		<!-- 商品规格选择 -->
		<div class="shop-choose">
			<div class="shop-choose-close" @click="remove(this);">X</div>
			<div class="shop-chooseBox">
				<div class="shop-choose-pro">
					<img src="../images/pro.png" height="418" width="345" class="shop-choose-img fl" alt="">
					<div class="shop-choose-proCont fl">
						<div class="shop-choose-money">
							￥<span>{{money}}</span>
						</div>
						<div class="shop-choose-proNum">
							库存{{mall_goods.goods_num}}件
						</div>
						<p>请选择商品规格数量</p>
					</div>
					<div class="clear"></div>
				</div>
				<div v-for='(item,index) in goods_spec'>
					<div class="shop-choose-ggTitle">
						{{item.sp_name}}
					</div>
					<div class="shop-choose-gg">
						<div v-for='(json,index2) in item.goods_spec' @click="toggle(json.sv_id,index)" class="shop-choose-gg-item " v-bind:class=" {active:item.show==json.sv_id}" :id-data="json.sv_id">{{json.category_spec_value[0].sv_name}}</div>
					</div>
				</div>
				<div class="shop-choose-numBox">
					<p class="fl">数量</p>
					<div class="shop-choose-numchange fr">
						<div class="shop-choose-lass fl" @click='lass(this)'>-</div>
						<div class="shop-choose-num fl">{{num}}</div>
						<div class="shop-choose-more fl" @click='more(this)'>+</div>
						<div class="clear"></div>
					</div>
					<div class="clear"></div>
				</div>
			</div>
			<div class="shop-shoose-ok" @click='jionShopping()'>确定</div>
		</div>
		<!-- /配送地址 -->
		<div class="address-box">
			<div class="coupon-title">
				配送至
			</div>
			<div class="shop-choose-close" @click="remove(this);">X</div>
			<div class="address-list">
				<div class="address-list-item" :class="{'active':item.receiver_default==1}" v-for="(item,index) in address" @click="chooseAdress(index)">
					{{item.receiver_province}}{{item.receiver_city}}{{item.receiver_county}}{{item.receiver_address}}
				</div>

			</div>
		</div>
	</div>
	<!-- <toast v-model="success" type="text" width="3rem">{{msg}}</toast> -->
</template>
<script>
	import $ from 'jquery'
	import axios from 'axios'
	import BScroll from 'better-scroll';
	import CountDown from 'vue2-countdown'
	import {
		XHeader,
		Loading,
		Toast,
		Swiper,
		SwiperItem,
		Alert
	} from 'vux'
	export default {
		data() {
			return {
				banner_list: [],
				goHomeButton: true,
				cart_num: true,
				money: 170.00,
				paymoney: 170.00,
				num: 1,
				goods: '',
				mall_goods: '',
				goods_spec: '',
				goods_sku: '',
				kucunNumL: '',
				skuId: '',
				id: '',
				goods_cart_total: '',
				shopInfo: '',
				address: '',
				defaultAdd: ''
				// success: false,
				// msg: '',
			}
		},
		components: {
			Alert,
			Loading,
			Toast,
			Swiper,
			SwiperItem,
		},
		watch: {
			'$route': function(to, from) {
				// this.getGoodsDetail();
				window.parent.scrollTo(0, 0);
			}
		},
		beforeRouteEnter(to, from, next) {
			next(vm => {
				vm.fullName = from.name;
			})
		},
		// beforeRouteLeave(to, from, next) {
		// 	console.log(to);
		// 	console.log(from);
		// 	if(to.name == 'Detail') {
		// 		from.meta.keepAlive = true;
		// 	} else {
		// 		from.meta.keepAlive = false;
		// 	}
		// 	next();
		// },
		mounted() {
			// this.getSpecialInfo();
			this.windowScroll();
			this.getGoodsDetail();
			this.getcart();
			this.getAdress();
		},
		methods: {
			couponshow: function(e) {
				$('.coupon').animate({
					bottom: "0",
				});
				$('.showBc').addClass('show');
			},
			shopingshow: function(e) {
				$('.shop-choose').animate({
					bottom: "0",
				});
				$('.showBc').addClass('show');
			},
			addressshow: function(e) {
				$('.address-box').animate({
					bottom: "0",
				});
				$('.showBc').addClass('show');
			},
			remove: function(e) {
				$('.showBc').removeClass('show');
				$('.coupon').animate({
					bottom: "-100%",
				}, 1000);
				$('.shop-choose').animate({
					bottom: "-100%",
				}, 1000);
				$('.address-box').animate({
					bottom: "-100%",
				}, 1000);
			},
			more: function(e) {
				this.num = this.num + 1;
				var inmoney = parseInt(this.mall_goods.goods_price);
				$('.shop-choose-num').html(this.num);
				this.money += inmoney;

			},
			lass: function(e) {
				if(this.num > 1) {
					this.num = this.num - 1;
					var inmoney = parseInt(this.mall_goods.goods_price);

					$('.shop-choose-num').html(this.num);
					this.money -= inmoney;
				}
			},
			//获取banner图
			back: function() {
				window.history.go(-1);
			},
			windowScroll: function() {
				$(window).scroll(function(event) {
					//					console.log($(window).scrollTop())
					if($(window).scrollTop() > 100) {
						$('.shoping-header').addClass('show')
					} else {
						$('.shoping-header').removeClass('show')
					}
				});
			},

			getcart: function() {
				this.$http({
					method: 'GET',
					url: '/los/api/mall_member/cart_list.json'
				}).then((res) => {
					this.goods_cart_total = res.data.data.goods_cart_total;
					this.$http({
						method: 'POST',
						url: '/los/api/member/login_check.json',
					}).then((res) => {
						console.log("/////");

						console.log(res.data.code);
						if(res.data.code == 1) {
							this.cart_num = true;
						} else {
							this.cart_num = false;
						}
					}).catch((err) => {

					})
				}).catch((err) => {
					console.log(err);
				})
			},
			//获取商品信息
			getGoodsDetail: function() {
				window.parent.scrollTo(0, 0);
				this.show1 = true;
				let shop_id = 0;
				this.id = this.$route.params.id;
				this.ShareLink = 'http://pm.haowenwan.com/dist/#/Detail/id/' + this.id;
				this.$http({
					method: 'GET',
					url: '/los/api/mall/goods_details.json?commodity_id=' + this.id,
					data: ''
				}).then((result) => {

					if(result.data.code == 1) {
						this.goods = result.data.data.goods;
						this.mall_goods = result.data.data.mall_goods;
						this.money = parseFloat(this.mall_goods.goods_price);
						this.banner_list = result.data.data.goods.goods_imgs;
						this.goods_sku = result.data.data.goods_sku;
						console.log(this.money);
						//获取店铺信息
						this.$http({
							method: 'GET',
							url: '/los//api/shop/details.json?shop_id=' + this.goods.shop_id,
						}).then((res) => {
							if(res.data.code == 1) {
								this.shopInfo = res.data.data;
							}
						}).catch((err) => {
							console.log(err)
						})
					}

				}).catch((err) => {
					console.log(err);
				})
				//获取商品规格
				this.$http({
					method: 'GET',
					url: "/los/api/mall/goods_spec_list.json?commodity_id=" + this.id,
					data: ''
				}).then((result) => {
					console.log(result)
					if(result.data.code == 1) {
						//1
						$.each(result.data.data.goods_spec, function(index, el) {
							console.log(this)
							this.show = '';
						});
						this.goods_spec = result.data.data.goods_spec;
						console.log(this.goods_spec)
					}
				})

			},
			//获取地址信息
			getAdress: function() {
				this.$http({
					method: 'GET',
					url: "/los/api/member/receiver_list.json",
				}).then((res) => {
					res = res.data;
					let that = this;
					this.address = res.list;
					console.log(this.address);
					$.each(this.address, function(index) {
						//判断默认地址
						if(this.receiver_default == 1) {
							that.defaultAdd = this;
						}
					})
				}).catch((err) => {
					console.log(err)
				})
			}, //选择地址
			chooseAdress: function(index) {
				$.each(this.address, function() {
					this.receiver_default = 0;
				})
				this.address[index].receiver_default = 1;
				this.remove();
				this.defaultAdd = this.address[index];
			},
			jionShopping: function() {
				console.log('1')
				let id = this.$route.params.id;
				if(this.goods_sku.length == 0) {
					var params = {
						commodity_id: id,
						buy_num: this.num,
					}
					this.$http({
						method: 'POST',
						url: '/los/api/mall_member/cart_add.json',
						data: params
					}).then((result) => {
						if(result.data.code == 1) {
							this.remove();
							// this.success = !this.success;
							// this.msg = result.data.msg;
							alert(result.data.msg)
						}
					}).catch((err) => {
						console.log(err);
					})
				} else {
					var arry = [];
					$.each(this.goods_spec, function(index, el) {
						if(this.show != '') {
							arry.push(this.show)
						}
					});
					if(arry.length == this.goods_spec.length) {
						if(this.skuId != '') {
							var params = {
								commodity_id: id,
								sku_id: this.skuId,
								buy_num: this.num,
							}
							this.$http({
								method: 'POST',
								url: '/los/api/mall_member/cart_add.json',
								data: params
							}).then((result) => {
								if(result.data.code == 1) {
									this.remove();
									// this.success = !this.success;
									// this.msg = result.data.msg;
									alert(result.data.msg)
								}
							}).catch((err) => {
								console.log(err);
							})
						} else {
							alert('没库存了！')
						}
					} else {
						alert('请选择规格')
					}
				}

			},
			toggle: function(id, index) {
				this.goods_spec[index].show = id;
				var that = this;
				var list = that.goods_sku;
				var arry = [];
				$.each(that.goods_spec, function(index, el) {
					if(this.show != '') {
						arry.push(this.show)
					}
				});
				if(arry.length == this.goods_spec.length) {
					var num = 0;
					var skuSn = '';
					for(var i = 0; i < arry.length; i++) {
						for(var i = 0; i < arry.length; i++) {
							if(i == 0) {
								skuSn = arry[i]
							} else {
								skuSn = skuSn + '-' + arry[i]
							}
						}
						console.log(skuSn)
						var activenum = 0;
						$.each(that.goods_sku, function(index, el) {
							if(this.sku_sn == skuSn) {
								console.log('skuID出来了！！' + this.sku_id)
								that.paymoney = this.sku_price * that.num;
								activenum = activenum + 1;
								that.skuId = this.sku_id
							}
						});
						if(activenum == 0) {
							// Vue.component('空的！', Alert)
							alert('空的')
						}
					}

				}

			}
		}
	}
</script>

<style scoped>
	.detialBanner .swiper-container {
		width: 100%;
		height: 10.213333rem;
	}
	
	.detialBanner {
		position: relative;
	}
	
	.detialBanner .swiper-slide {
		text-align: center;
		font-size: 18px;
		background: #fff;
		/* Center slide text vertically */
		display: -webkit-box;
		display: -ms-flexbox;
		display: -webkit-flex;
		display: flex;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		-webkit-justify-content: center;
		justify-content: center;
		-webkit-box-align: center;
		-ms-flex-align: center;
		-webkit-align-items: center;
		align-items: center;
	}
	
	.detialBanner img {
		display: block;
		width: 100%;
		height: 100%;
	}
	
	.swiper-pagination {
		width: 0.986667rem!important;
		height: 0.453333rem;
		border-radius: 0.226667rem;
		background: rgba(0, 0, 0, 0.6);
		color: #fff;
		left: 8.613333rem!important;
		line-height: 0.453333rem;
		font-size: 0.293333rem;
		bottom: 0.36rem!important;
	}
	
	.back-list {
		position: absolute;
		top: 0.133333rem;
		left: 0;
		z-index: 10;
		width: 100%;
		padding: 0 0.4rem;
		box-sizing: border-box;
	}
	
	.back-list img {
		width: 0.88rem;
		height: 0.88rem;
		display: inline-block;
	}
	
	.share {
		margin-right: 0.213333rem;
	}
	
	.shop-text {
		position: absolute;
		bottom: 0.826667rem;
		left: 0.4rem;
		z-index: 10;
		/*width: 3.92rem;*/
		height: 0.853333rem;
		background: rgba(237, 91, 27, 0.5);
		padding: 0.213333rem 0.466667rem;
		box-sizing: border-box;
		color: #fff;
		border-radius: 0.426667rem;
	}
	
	.shop-text img {
		display: inline-block;
		width: 0.426667rem;
		height: 0.426667rem;
		margin-right: 0.133333rem;
	}
	
	.detial-titleBox {
		background-color: #fff;
		padding: 0.533333rem 0.4rem;
		box-sizing: border-box;
	}
	
	.detial-titleBox .detial-money {
		color: #DD2835;
		font-size: 0.666667rem;
		line-height: 0.533333rem;
	}
	
	.detial-titleBox .detial-money p {
		display: inline-block;
		margin-right: 0.213333rem;
		letter-spacing: -0.026667rem;
	}
	
	.detial-titleBox .detial-money span {
		font-size: 0.32rem;
		text-decoration: line-through;
		color: #666;
	}
	
	.detial-titleBox .detial-shopid {
		color: #666;
		font-size: 0.32rem;
		line-height: 0.493333rem;
	}
	
	.detial-titleCont {
		margin-top: 0.466667rem;
	}
	
	.detial-titleCont .detial-boxLeft {
		height: 1.2rem;
		width: 7.666667rem;
		border-right: solid 0.013333rem #e6e6e6;
		padding-right: 0.653333rem;
		box-sizing: border-box;
	}
	
	.detial-titleCont .detial-boxLeft .detial-title {
		font-size: 0.426667rem;
		margin-bottom: 0.2rem;
		color: #222;
	}
	
	.detial-titleCont .detial-boxLeft .detial-title span {
		font-size: 0.426667rem;
		color: #222;
		line-height: 0.4rem;
		display: inline;
		font-weight: 400;
	}
	
	.detial-titleCont .detial-boxLeft .detial-title .detial-title-class {
		display: inline-block;
		width: 0.666667rem;
		height: 0.4rem;
		border: solid #DD2835 0.013333rem;
		font-size: 0.266667rem;
		color: #DD2835;
		text-align: center;
		line-height: 0.4rem;
		/*box-sizing:border-box;*/
		margin-right: 0.133333rem;
		font-weight: none;
	}
	
	.detial-titleCont .detial-boxLeft .detial-titleContC {
		color: #666666;
		font-size: 0.373333rem;
		margin-top: 0.066667rem;
		overflow: hidden;
		text-overflow: ellipsis;
	}
	
	.detial-titleCont .detial-boxRight {
		width: 1.533333rem;
		text-align: center;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		margin-top: 0.2rem;
	}
	
	.detial-titleCont .detial-boxRight p {
		font-size: 0.373333rem;
		color: #DD2835;
	}
	
	.detial-titleCont .detial-boxRight span {
		color: #999;
	}
	
	.parameter-list {
		background-color: #fff;
		margin-top: 0.266667rem;
		padding: 0 0.4rem;
		box-sizing: border-box;
	}
	
	.parameter-list .parameter-item {
		/*height: 1.426667rem;*/
		border-bottom: solid #e6e6e6 0.013333rem;
		line-height: 1.426667rem;
		position: relative;
	}
	
	.parameter-list .parameter-item .parameter-title {
		display: inline-block;
		font-size: 0.32rem;
		margin-right: 0.506667rem;
		color: #666;
	}
	
	.parameter-list .parameter-item .discount-list {
		width: 7.146667rem;
	}
	
	.parameter-list .parameter-item .discount-list .discount-item {
		display: inline-block;
		width: 1.946667rem;
		height: 0.48rem;
		color: #fff;
		line-height: 0.48rem;
		background-color: #DD2835;
		text-align: center;
		position: relative;
		border-radius: 0.053333rem;
		margin-right: 0.266667rem;
	}
	
	.parameter-list .parameter-item .discount-list .discount-item:before {
		content: '';
		left: -0.08rem;
		top: 0.16rem;
		background-color: #fff;
		border-radius: 100%;
		width: 0.16rem;
		height: 0.16rem;
		position: absolute;
	}
	
	.parameter-list .parameter-item .discount-list .discount-item:after {
		content: '';
		right: -0.08rem;
		top: 0.16rem;
		background-color: #fff;
		border-radius: 100%;
		width: 0.16rem;
		height: 0.16rem;
		position: absolute;
	}
	
	.parameter-list .parameter-item .discount-more a {
		display: block;
	}
	
	.parameter-list .parameter-item .discount-more,
	.fafafa .discount-more {
		/*position: absolute;
	  right: 0.4rem;
	  top:0.4rem;*/
		width: 0.426667rem;
		height: 0.426667rem;
		display: block;
		margin-top: 0.493333rem;
	}
	
	.discount-list .active-img {
		display: inline-block;
		width: 0.8rem;
		height: 0.8rem;
		margin-top: 0.306667rem;
		border-radius: 0.053333rem;
		margin-right: 0.266667rem;
	}
	
	.address {
		line-height: 0.333333rem;
		margin-top: 0.52rem;
		margin-bottom: 0.213333rem;
		font-size: 0.346667rem;
	}
	
	.discount-num {
		line-height: 0.333333rem;
	}
	
	.discount-num span {
		color: #DD2835;
		display: inline-block;
		margin-right: 0.333333rem;
		font-size: 0.346667rem;
	}
	
	.discount-num p {
		color: #222;
		font-size: 0.346667rem;
		display: inline-block;
		margin-bottom: 0.466667rem;
	}
	
	.cs {
		font-size: 0.346667rem;
	}
	
	.fafafa {
		background-color: #fafafa;
		padding-right: 0.2rem;
		box-sizing: border-box;
		height: 1.2rem;
		line-height: 1.2rem!important;
		padding: 0 0.4rem;
		position: relative;
	}
	
	.fafafa .img-list {
		height: 100%;
	}
	
	.fafafa .img-item {
		display: inline-block;
	}
	
	.fafafa img {
		display: inline-block;
		width: 0.4rem;
		height: 0.4rem;
		margin-top: 0.4rem;
		margin-right: 0.106667rem;
	}
	
	.fafafa .discount-more {
		margin-right: 0;
	}
	
	.comment {
		background-color: #fff;
		margin-top: 0.266667rem;
		padding: 0.453333rem 0.373333rem;
	}
	
	.comment .comment-title-box {
		font-size: 0.373333rem;
		line-height: 0.373333rem;
		margin-bottom: 0.4rem;
	}
	
	.comment .comment-title-box .comment-title {
		font-size: 0.4rem;
		font-weight: bold;
		margin-right: 0.213333rem;
	}
	
	.comment .comment-title-box .comment-good span {
		color: #666;
		margin-left: 0.066667rem;
	}
	
	.comment .comment-title-box .commeng-write {
		color: #DD2835;
	}
	
	.comment .comment-title-box .commeng-write img {
		display: inline-block;
		width: 0.373333rem;
		height: 0.373333rem;
		margin-right: 0.066667rem;
	}
	
	.comment-list {
		text-align: center;
	}
	
	.comment-list .comment-item {
		display: inline-block;
		padding: 0.173333rem 0.373333rem;
		color: #222;
		font-size: 0.32rem;
		background-color: #FFF3F4;
		border-radius: 0.32rem;
		margin-right: 0.56rem;
	}
	
	.comment-list .comment-item:nth-of-type(3n) {
		margin-right: 0;
	}
	
	.commentCont-list {
		margin-top: 0.48rem;
	}
	
	.commentCont-list .commentCont-item {
		border: solid 0.013333rem #E6E6E6;
		border-radius: 0.08rem;
		display: inline-block;
		margin-right: 0.266667rem;
		width: 9.066667rem
	}
	
	.commentCont-list .commentCont-item .commentCont-left {
		padding: 0.28rem;
		padding-right: 0.866667rem;
		box-sizing: border-box;
		width: 5.313333rem;
	}
	
	.commentCont-list .commentCont-item .commentCont-left .commentCont-user {
		font-size: 0.32rem;
		line-height: 0.693333rem
	}
	
	.commentCont-list .commentCont-item .commentCont-left .commentCont-user .commentCont-userImg {
		display: inline-block;
		width: 0.693333rem;
		height: 0.693333rem;
		border-radius: 100%;
		margin-right: 0.2rem;
	}
	
	.commentCont-list .commentCont-item .commentCont-left .commentCont-user .commentCont-userState {
		display: inline-block;
		width: 0.346667rem;
		height: 0.346667rem;
		margin-top: 0.2rem;
		margin-left: 0.133333rem;
	}
	
	.commentCont-list .commentCont-item .commentCont-left .comment-num {
		margin-top: 0.266667rem;
		color: #DD2835;
		font-size: 0.293333rem;
		line-height: 0.35rem;
	}
	
	.commentCont-list .commentCont-item .commentCont-left .comment-num span {
		display: inline-block;
		margin-left: 0.133333rem;
	}
	
	.commentCont-list .commentCont-item .commentCont-left .comment-num .comment-num-item {
		display: inline-block;
		width: 0.32rem;
		height: 0.293333rem;
		background: url('../images/xing2.png')center center;
		background-size: 100% 100%;
		margin-bottom: 0.2rem;
		margin-right: 0.066667rem;
	}
	
	.commentCont-list .commentCont-item .commentCont-left .comment-num .comment-num-item.active {
		background: url('../images/xing.png')center center;
		background-size: 100% 100%;
	}
	
	.commentCont-list .commentCont-item .commentCont-left .comment-cont {
		line-height: 0.373333rem;
		white-space: pre-wrap;
	}
	
	.commentCont-list .commentCont-item .commentCont-right {
		width: 3.6rem;
		height: 3.6rem;
		border-radius: 0px 0.08rem 0.08rem 0px;
		position: relative;
	}
	
	.commentCont-list .commentCont-item .commentCont-right img {
		width: 100%;
		height: 100%;
	}
	
	.commentCont-list .commentCont-item .commentCont-right .commentCont-right-bc {
		position: absolute;
		top: 0.266667rem;
		right: 0.266667rem;
		background: rgba(0, 0, 0, 0.5);
		color: #fff;
		font-size: 0.266667rem;
		padding: 0 0.146667rem;
		border-radius: 0.186667rem;
		line-height: 0.373333rem;
	}
	
	.commentCont-list {
		overflow-x: auto;
		overflow-y: none;
		/*height: 3.6rem;*/
		white-space: nowrap;
	}
	
	.answer-title {
		font-size: 0.4rem;
		padding-top: 0.466667rem;
		font-weight: bold;
		margin-bottom: 0.4rem;
	}
	
	.answer-title img {
		display: inline-block;
		;
		width: 0.16rem;
		height: 0.28rem;
	}
	
	.answer-item {
		line-height: 0.4rem;
		margin-bottom: 0.36rem;
	}
	
	.answer-item img {
		width: 0.373333rem;
		height: 0.373333rem;
		display: inline-block;
		margin-right: 0.186667rem;
	}
	
	.answer-item .answer-cont {
		width: 6.48rem;
		font-size: 0.346667rem;
		color: #222;
		overflow: hidden;
		white-space: nowrap;
		text-overflow: ellipsis;
	}
	
	.answer-item .answer-num {
		font-size: 0.346667rem;
		color: #666
	}
	
	.shop {
		padding: 0.56rem 0.4rem;
		background-color: #fff;
		margin-top: 0.266667rem;
	}
	
	.shop-title-box {
		display: flex;
	}
	
	.shop-title-box .shop-img {
		width: 1.093333rem;
		height: 1.093333rem;
		margin-right: 0.266667rem;
	}
	
	.shop-title-box {
		margin-bottom: 0.533333rem;
	}
	
	.shop-title-box .shop-release {
		display: flex;
		flex-direction: column;
		flex: 1;
		margin-left: 0.26rem;
	}
	
	.shop-title-box .shop-release .shop-title {
		font-size: 0.4rem;
		color: #222;
		line-height: 0.48rem;
		font-weight: bold;
	}
	
	.shop-title-box .shop-release .shop-title img {
		width: 0.48rem;
		height: 0.48rem;
		display: inline-block;
		margin-left: 0.133333rem;
	}
	
	.shop-title-box .shop-release .shop-release-item {
		color: #666;
		font-size: 0.32rem;
		margin-top: 0.226667rem;
		line-height: 0.32rem;
	}
	
	.shop-title-box .shop-release .shop-release-item img {
		width: 0.32rem;
		height: 0.32rem;
		display: inline-block;
	}
	
	.shop-title-box .goshop {
		display: inline-block;
		width: 1.946667rem;
		height: 0.666667rem;
		line-height: 0.666667rem;
		margin-top: 0.133333rem;
		background: #DD2835;
		color: #fff;
		text-align: center;
		border-radius: 0.333333rem;
	}
	
	.shop-title-box .goshop a {
		color: #fff;
	}
	
	.shop-num-item {
		width: 1.6rem;
		margin-right: 1.333333rem;
		font-size: 0.346667rem;
		color: #222;
		text-align: center;
		color: #666;
	}
	
	.shop-num-item p {
		color: #222;
		font-size: 0.373333rem;
		margin-top: 0.24rem;
		line-height: 0.28rem;
		margin-bottom: 0.32rem;
	}
	
	.shop-num-item2 .shop-num-box {
		font-size: 0.32rem;
		color: #666;
		line-height: 0.373333rem;
		margin-bottom: 0.186667rem;
		position: relative;
		padding-right: 0.436667rem;
	}
	
	.shop-num-item2 .shop-num-box b {
		font-size: 0.373333rem;
	}
	
	.shop-num-item2 .shop-num-box span {
		display: inline-block;
		width: 0.373333rem;
		height: 0.373333rem;
		line-height: 0.373333rem;
		background-color: #DD2828;
		border-radius: 0.053333rem;
		color: #fff;
		opacity: 0.6;
		text-align: center;
		font-size: 0.266667rem;
		position: absolute;
		right: 0;
		top: 0;
	}
	
	.similar {
		margin-top: 0.266667rem;
		background-color: #fff;
		padding: 0 0.466667rem;
	}
	
	.similar-item {
		width: 2.88rem;
		margin-right: 0.213333rem;
		position: relative;
		margin-bottom: 0.48rem;
	}
	
	.similar-item:nth-of-type(3n) {
		margin-right: 0;
	}
	
	.similar-item img {
		display: inline-block;
		width: 100%;
		height: 2.373333rem;
		border-radius: 0.106667rem;
	}
	
	.similar-item .similar-item-title {
		font-size: 0.32rem;
		line-height: 0.306667rem;
		margin-top: 0.186667rem;
		margin-bottom: 0.186667rem;
	}
	
	.similar-item .similar-item-nowmoney {
		font-size: 0.4rem;
		color: #DD2835;
		font-weight: bold;
	}
	
	.similar-item .similar-item-nowmoney span {
		font-size: 0.266667rem;
		margin-left: 0.066667rem;
	}
	
	.similar-item .similar-item-money {
		color: #666;
		font-size: 0.266667rem;
		text-decoration: line-through;
	}
	
	.similar-item .similar-item-goshop {
		position: absolute;
		width: 0.64rem;
		height: 0.64rem;
		right: 0;
		bottom: 0;
		/*background-color: red;*/
		border-radius: 100%;
		overflow: hidden;
	}
	
	.similar-item .similar-item-goshop a {
		display: block;
	}
	
	.similar-item .similar-item-goshop img {
		display: block;
		width: 100%;
		height: 100%;
	}
	
	.detialCont-title {
		width: 100%;
		height: 1.266667rem;
		line-height: 1.306667rem;
		text-align: center;
	}
	
	.detialCont-title p {
		text-align: center;
		width: 2.266667rem;
		font-size: 0.373333rem;
		position: relative;
		margin: 0 auto;
		display: block;
	}
	
	.detialCont-title p:before {
		content: '';
		left: -1.733333rem;
		top: 0.653333rem;
		width: 1.733333rem;
		height: 0.013333rem;
		position: absolute;
		background: #ccc;
	}
	
	.detialCont-title p:after {
		content: '';
		right: -1.733333rem;
		top: 0.653333rem;
		width: 1.733333rem;
		height: 0.013333rem;
		position: absolute;
		background: #ccc;
	}
	
	.detialCont-box img {
		max-width: 100%;
	}
	
	.footer {
		height: 1.44rem;
		position: fixed;
		bottom: 0;
		left: 0;
		z-index: 100;
		background-color: #fff;
		box-shadow: 0px 0.013333rem 0.093333rem 0px rgba(230, 230, 230, 1);
		width: 100%;
	}
	
	.footer .footer-state {
		width: 4.026667rem;
		display: flex;
		text-align: center;
		font-size: 0.293333rem;
		color: #666;
	}
	
	.footer .footer-state .footer-state-item {
		flex-direction: row;
		flex-basis: 33.33%;
	}
	
	.footer .footer-state .footer-state-item a {
		display: block;
		padding-top: 0.293333rem;
		box-sizing: border-box;
	}
	
	.footer .footer-state .footer-state-item a img {
		display: inline-block;
		width: 0.426667rem;
	}
	
	.footer .footer-state .shoping {
		position: relative;
	}
	
	.footer .footer-state .shoping .shoping-bc {
		position: absolute;
		right: 0.186667rem;
		top: 0.186667rem;
		width: 0.373333rem;
		height: 0.373333rem;
		text-align: center;
		line-height: 0.373333rem;
		color: #fff;
		background: linear-gradient(90deg, rgba(221, 40, 53, 1) 27%, rgba(230, 96, 105, 1) 100%);
		border-radius: 50%;
		font-size: 0.266667rem
	}
	
	.footer .join-shop {
		width: 2.986667rem;
		background: linear-gradient(90deg, rgba(221, 40, 53, 0.5) 0%, rgba(221, 40, 87, 0.5) 100%);
		color: #fff;
		font-size: 0.4rem;
		height: 100%;
		line-height: 1.44rem;
		text-align: center;
	}
	
	.footer .go-shop {
		width: 2.986667rem;
		height: 100%;
		line-height: 1.44rem;
		text-align: center;
		color: #fff;
		background: linear-gradient(90deg, rgba(221, 40, 53, 1) 0%, rgba(221, 40, 87, 1) 100%);
		font-size: 0.4rem;
	}
	
	.showBc {
		background-color: rgba(0, 0, 0, 0.5);
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		z-index: 1000;
		display: none;
	}
	
	.showBc.show {
		display: block;
	}
	
	.coupon,
	.shop-choose,
	.shop-address,
	.address-box {
		position: fixed;
		bottom: -100%;
		left: 0;
		width: 100%;
		padding: 0.4rem;
		z-index: 1001;
		background-color: #fff;
		border-radius: 0.266667rem 0.266667rem 0px 0px;
		box-sizing: border-box;
	}
	
	.coupon.show,
	.shop-choose.show,
	.address-box.show {
		bottom: 0;
	}
	
	.coupon-title {
		font-size: 0.426667rem;
		text-align: center;
		margin-bottom: 0.8rem;
	}
	
	.coupon .coupon-close,
	.shop-choose .shop-choose-close,
	.address-box .shop-choose-close {
		position: absolute;
		top: 0.4rem;
		right: 30px;
		width: 0.32rem;
		height: 0.32rem;
		text-align: center;
		font-size: 0.4rem;
		color: #666;
	}
	
	.coupon .copon-item {
		margin-top: 0.4rem;
		position: relative;
	}
	
	.coupon .copon-item img {
		width: 100%;
		display: block;
	}
	
	.coupon .copon-item .copon-item-title {
		width: 0.333333rem;
		color: #fff;
		line-height: 0.36rem;
		text-align: center;
		position: absolute;
		left: 0.466667rem;
		top: 0.48rem;
		font-size: 0.32rem;
	}
	
	.coupon .copon-item .copon-item-contBox {
		position: absolute;
		left: 1.6rem;
		top: 0.533333rem;
		color: #fff;
		font-size: 0.32rem;
	}
	
	.coupon .copon-item .copon-item-contBox .copon-item-money {
		font-size: 0.32rem;
		line-height: 0.6rem;
		margin-bottom: 0.246667rem;
	}
	
	.coupon .copon-item .copon-item-contBox .copon-item-money span {
		font-size: 0.773333rem;
		line-height: 0.6rem;
		display: inline-block;
		;
	}
	
	.coupon .copon-item .copon-item-go,
	.coupon .copon-item .copon-item-go2 {
		width: 2.4rem;
		height: 2.4rem;
		right: 0.133333rem;
		top: 0.133333rem;
		position: absolute;
		color: #fff;
		font-size: 0.373333rem;
		text-align: center;
		padding: 0.733333rem 0.73rem;
		box-sizing: border-box;
	}
	
	.coupon .copon-item .copon-item-go2 {
		color: #fff;
		opacity: 0.3;
	}
	
	.coupon .copon-text {
		color: #999999;
		text-align: center;
		margin-top: 0.773333rem;
	}
	
	.coupon .copon-text span {
		position: relative;
		line-height: 0.4rem;
	}
	
	.coupon .copon-text span:before {
		content: '';
		position: absolute;
		left: -0.266667rem;
		top: 0.133333rem;
		width: 0.08rem;
		height: 0.08rem;
		border-radius: 100%;
		background-color: #ccc;
	}
	
	.coupon .copon-text span:after {
		content: '';
		position: absolute;
		right: -0.266667rem;
		top: 0.133333rem;
		width: 0.08rem;
		height: 0.08rem;
		border-radius: 100%;
		background-color: #ccc;
	}
	
	.shop-choose .shop-choose-pro img {
		display: block;
		width: 2.96rem;
		height: 2.96rem;
		margin-right: 0.346667rem;
	}
	
	.shop-choose .shop-choose-pro .shop-choose-proCont {
		padding-top: 1.066667rem;
	}
	
	.shop-choose .shop-choose-pro .shop-choose-money {
		font-size: 0.32rem;
		color: #DD2835;
		line-height: 0.44rem;
		letter-spacing: -0.026667rem;
	}
	
	.shop-choose .shop-choose-pro .shop-choose-money span {
		font-size: 0.666667rem;
	}
	
	.shop-choose .shop-choose-pro .shop-choose-proNum {
		font-size: 0.32rem;
		color: #999;
		line-height: 0.333333rem;
		margin-top: 0.2rem;
	}
	
	.shop-choose .shop-choose-pro p {
		font-size: 0.373333rem;
		line-height: 0.36rem;
		margin-top: 0.4rem;
	}
	
	.shop-choose .shop-choose-close {
		color: #999
	}
	
	.shop-choose .shop-choose-gg .shop-choose-gg-item {
		display: inline-block;
		padding: 0.2rem 0.466667rem;
		background-color: #F5F5F5;
		border-radius: 0.373333rem;
		margin-right: 0.266667rem;
		margin-bottom: 0.266667rem;
	}
	
	.shop-choose .shop-choose-gg .shop-choose-gg-item.active {
		border: 1px solid #DD2835;
		color: #DD2835;
		box-sizing: border-box;
	}
	
	.shop-choose .shop-choose-gg .shop-choose-gg-item.nomor {
		border: dashed 0.013333rem #ccc;
		color: #ccc;
	}
	
	.shop-choose-ggTitle {
		font-size: 0.373333rem;
		margin-top: 0.733333rem;
		margin-bottom: 0.4rem;
	}
	
	.shop-choose-numBox {
		line-height: 0.586667rem;
		margin-top: 0.866667rem;
		font-size: 0.373333rem
	}
	
	.shop-choose-numBox .shop-choose-lass,
	.shop-choose-numBox .shop-choose-more {
		background-color: #ccc;
		width: 0.586667rem;
		height: 0.586667rem;
		line-height: 0.586667rem;
		text-align: center;
		border-radius: 100%;
		color: #fff;
		font-size: 0.466667rem;
	}
	
	.shop-choose-numBox .shop-choose-num {
		padding: 0 0.4rem;
	}
	
	.shop-shoose-ok {
		width: 100%;
		height: 1.306667rem;
		line-height: 1.306667rem;
		text-align: center;
		color: #fff;
		font-size: 0.4rem;
		background: linear-gradient(90deg, rgba(221, 40, 53, 1) 0%, rgba(221, 40, 87, 1) 100%);
	}
	
	.shop-choose {
		padding: 0;
	}
	
	.shop-chooseBox {
		padding: 0.4rem;
	}
	
	.address-list-item {
		padding: 0 0.6rem;
		margin-top: 0.68rem;
		font-size: 0.373333rem;
		position: relative;
	}
	
	.address-list-item:after {
		content: '';
		position: absolute;
		left: 0;
		top: 0.066667rem;
		width: 0.426667rem;
		height: 0.426667rem;
		background: url(../images/address2.png)center center;
		background-size: 100% 100%;
	}
	
	.address-list-item.active:after {
		background: url(../images/address.png)center center;
		background-size: 100% 100%;
	}
	
	.address-list-item.active:before {
		content: '';
		right: 0;
		top: 0.24rem;
		position: absolute;
		background: url(../images/right.png)center center;
		background-size: 100% 100%;
		width: 0.346667rem;
		height: 0.346667rem;
	}
	
	.address-list-item.active {
		color: #DD2835 !important;
	}
	
	.shoping-header {
		height: 1.173333rem;
		line-height: 1.173333rem;
		position: fixed;
		top: -100%;
		left: 0;
		background-color: #fff;
		color: #222;
		font-size: 0.4rem;
		width: 100%;
		z-index: 999;
		transform: all 1s;
	}
	
	.shoping-header.show {
		top: 0;
	}
	
	.shoping-header img {
		display: block;
		width: 0.88rem;
		height: 0.88rem;
		margin-top: 0.173333rem;
		/*margin-left: 0.4rem;*/
		margin-right: 1.733333rem;
	}
	
	.shoping-header-list .shoping-header-item {
		display: inline-block;
		margin-right: 0.733333rem;
		color: #666;
	}
	
	.shoping-header-list .shoping-header-item:nth-of-type(3n) {
		margin-right: 0;
	}
	
	.shoping-header-share {
		width: 0.88rem;
		height: 0.88rem;
		margin-top: 0.173333rem;
	}
	
	.shoping-header-share img {
		display: block;
		width: 100%;
		height: 100%;
		margin: 0;
	}
	
	.shoping-header-more {
		width: 0.88rem;
		height: 0.88rem;
		margin-top: 0.173333rem;
		margin-left: 0.213333rem;
	}
	
	.shoping-header-more img {
		display: block;
		width: 100%;
		height: 100%;
		margin: 0;
	}
	
</style>
<style type="text/css" scoped>
			.vux-swiper{
				height: 100% !important;
			}
</style>